import * as echarts from 'echarts';

import chinaJson from './china.json';

const CenterChinaMap = (dataList: any, mapNode: HTMLElement) => {
  const mapOption = {
    title: {
      text: '2022 全国疫情省份数据',
      subtext: dataList.times,
      left: 'right',
    },
    tooltip: {
      trigger: 'item',
      showDelay: 0,
      transitionDuration: 0.2,
    },
    visualMap: {
      left: 'right',
      min: 200,
      max: 8000,
      inRange: {
        color: [
          '#313695',
          '#4575b4',
          '#74add1',
          '#abd9e9',
          '#e0f3f8',
          '#ffffbf',
          '#fee090',
          '#fdae61',
          '#f46d43',
          '#d73027',
          '#a50026',
        ],
      },
      text: ['High', 'Low'], // 文本，默认为数值文本
      calculable: true,
    },
    series: [
      {
        name: '累计确诊人数',
        type: 'map',
        map: 'china',
        projection: {},
        emphasis: {
          label: {
            show: true,
          },
        },

        data: dataList.list.map((data: any) => {
          return { name: data.name, value: data.value };
        }), // [{ name: '广东', value: 4822023 }],
      },
    ],
  };

  const centerMap = echarts.init(mapNode);

  echarts.registerMap('china', chinaJson);

  centerMap.setOption(mapOption);
};

export default CenterChinaMap;
